import React from 'react';
import { Button } from 'antd';
import "./index.less"

interface IModuleHeader {
    title: string; //标题
    onclick: Function; //点击更多后执行
    hideMore?: boolean;
}

/*
* 模块分类的顶部
* */
function ModuleHeader(props: IModuleHeader) {
    return (<div
        className="course-header"
    >
        <div style={{display: "flex", height: "0.3rem", alignItems: "center"}}>
                    <span style={{
                        width: "0.04rem",
                        height: "0.26rem",
                        backgroundColor: "#3e84fd",
                        marginRight: "0.17rem"
                    }}/>
            <a className="course-module-title">
                {props.title}
            </a>
        </div>
        {
            !props.hideMore ? <a className="ModuleHeader-more" onClick={() => {
                props?.onclick();
            }} style={{
                // color: "#333333",
                fontSize: "0.18rem",
                // backgroundColor: "#ffffff",
                width: "0.9rem",
                height: "0.3rem",
                display: "grid",
                placeItems: "center",
                borderRadius: "0.2rem",
            }}>
                更多 &nbsp;&gt;
            </a> : null
        }

    </div>)
};

export default ModuleHeader;